<template>
      <a-spin :spinning="loading">
  <a-list>
    <a-list-item v-for="(item, index) in list" :key="index">
      <router-link  class="no-focus" :to="{ 
        path: '/workflow/bpmn/process', 
        query: { 
          procdefId: item.processDefinitionId,
          processInstanceId: item.processInstanceId,
          taskId: item.taskId 
        } 
       }">
        <a-list-item-meta :description="item.createTime | moment('YYYY-MM-DD HH:mm:ss')">
          <template slot="title">
            <div v-if="item.lookTime">{{item.processName}}</div>
            <el-badge v-else value="new" class="item">{{item.processName}}</el-badge>
          </template>
        </a-list-item-meta>
      </router-link>
    </a-list-item> 
    <div
      v-if="total > 5"
      slot="loadMore"
      :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
    >
      <router-link :to="{ 
        name: 'desktopIndex', 
        params: {
          PersonalTask: true
        } 
       }">
        查看更多
      </router-link>
    </div>
  </a-list>
  </a-spin>
</template>

<script>
import { queryPersonalTask } from '@/api/workflow/bpmn/runtime'
export default {
  name: 'PersonalTask',
  data () {
    return {
      loading: false,
      total: 0,
      list: []
    }
  },
  methods: {
    async getList() {
      this.list = []
      this.total = 0
      const params = {
        pageNo: 1,
        pageSize: 5
      }
      this.loading = true
      const res = await queryPersonalTask(params)
      this.loading = false
      if (res.data) {
        this.total = res.data.total
        this.list = res.data.records
      }
    },
    onViewMore() {

    }
  }
}
</script>
<style lang="less" scoped>

</style>
